<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/vue.js"></script>
	</head>
	<body>
		<div id="app">
			{{count}}
			<!-- $event事件对象 -->
			<button @click="handelAdd1($event,66)">aad-1</button>
			<button @click="handelAdd2">aad-2</button>
			<input type="text" @input="handelInput"/>
			
			<ul @click.self="habdeUl">
				<li @click.stop="habdeLi">1111</li>
				<li @click="habdeLi">2222</li>
				<li>3333</li>
			</ul>
			
			<input type="text" @keyup.enter="you"/>
		</div>
		<script>
			var xm=new Vue({
				el:'#app',
				data:{
					count:1
				},
				methods:{
					handelAdd1(evt,a){
						this.count++
						console.log(evt,a)
					},
					handelAdd2(evt){
						this.count++
						console.log(evt.target)
					},
					handelInput(evt){
						console.log('handelInput',evt.target.value)
					},
					habdeLi(){
						console.log('li')
					},
					habdeUl(){
						console.log('ul')
					},
					you(evt){
						console.log(evt.target.value)
					}
				}
			})
		</script>
	</body>
</html>